<?php if(!class_exists("View", false)) exit("no direct access allowed");?><main id="main">
  <style>
    .top{text-align: end;padding-top: 10px;}
    .top_controller{margin: 5px;}
  </style>
  <div class="container">
    <div id="mainMenu" class="clearfix">
      <div class="btn-toolbar pull-left">
        <span class="btn btn-link btn-active-text"><span class="text">部门结构</span></span>
      </div>
    </div>
    <div id="mainContent" class="main-row">
      <div class="side-col col-4">
        <div class="panel">
          <div class="panel-heading">
            <div class="panel-title">维护部门</div>
          </div>
          <div class="panel-body">
            <ul data-name="tree-dept" id="deptTree" class="tree" data-idx="0">
                 
            </ul>
          </div>
        </div>
      </div>
      <div class="main-col col-8">
        <div class="panel">
          <div class="panel-heading">
            <div class="panel-title">下级部门</div>
          </div>
          <div class="panel-body">
            <form method="post" target="hiddenwin" action="/www/index.php?m=dept&amp;f=manageChild">
              <table class="table table-form">
                <tbody>
                  <tr>
                    <td>
                      <nobr>
                        <a href="/www/index.php?m=dept&amp;f=browse">人本智汇-凤凰FM</a>
                        &nbsp;<i class="icon-angle-right"></i>&nbsp; </nobr>
                    </td>
                    <td class="w-300px">
                      <input type="text" name="depts[id1]" id="depts[id1]" value="产品研发" class="form-control top_controller"
                        autocomplete="off">
                      <input type="text" name="depts[id2]" id="depts[id2]" value="市场运营" class="form-control top_controller"
                        autocomplete="off">
                      <input type="text" name="depts[id3]" id="depts[id3]" value="职能管理" class="form-control"
                        autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                      <input type="text" name="depts[]" id="depts[]" value="" class="form-control top_controller" autocomplete="off">
                    </td>
                    <td></td>
                  </tr>
                  <tr>
                    <td></td>
                    <td class="form-actions">
                      <button type="submit" id="submit" class="btn btn-wide btn-primary"
                        data-loading="稍候...">保存</button> <a href="javascript:history.go(-1);"
                        class="btn btn-back btn-wide">返回</a> <input type="hidden" name="maxOrder" id="maxOrder"
                        value="30">
                      <input type="hidden" name="parentDeptID" id="parentDeptID" value="0">
                    </td>
                  </tr>
                </tbody>
              </table>
            </form>
          </div>
        </div>
      </div>
    </div>
    <input type="hidden" id="dept" value='<?php echo htmlspecialchars($dept, ENT_QUOTES, "UTF-8"); ?>'>
    <script src="http://p1.renbenzhihui.com/zui/js/all.js"></script>
    <script>      
      $(function()
      {
          var data = JSON.parse($('#dept').val());
          var options = {
              name: 'deptTree',
              initialState: 'preserve',
              data: data,
              sortable: 
              {
                  lazy: true,
                  nested: true,
                  canMoveHere: function($ele, $target)
                  {
                      if($ele && $target && $ele.parent().closest('li').attr('data-id') !== $target.parent().closest('li').attr('data-id')) return false;
                  }
              },
              itemCreator: function($li, item)
              {
                  var link = item.id !== undefined ? ('<a href="<?php echo url(array('c'=>"System", 'a'=>"DepartmentBrowse", 'id'=>"", ));?>'+item.id+'">' + item.name + '</a>') : ('<span class="tree-toggle">' + item.name + '</span>');
                  var $toggle = $('<span class="dept-name module-name" data-id="' + item.id + '">' + link + '</span>');
                  if(item.manager)
                  {
                      $toggle.append('&nbsp; <span class="dept-manager text-muted"><i class="icon icon-user"></i> ' + item.managerName + '</span>');
                  }
                  $li.append($toggle);
                  return true;
              },
              actions: 
              {
                  sort:
                  {
                      title: '拖动排序',
                      template: '<a class="sort-handler"><i class="icon-move"></i></a>'
                  },
                  edit:
                  {
                      linkTemplate: '/System/DepartmentEdit/id/{0}',
                      title: '编辑部门',
                      template: '<a><i class="icon-edit"></i></a>'
                  },
                  "delete":
                  {
                      linkTemplate: '/System/DepartmentDel/id/{0}',
                      title: '删除部门',
                      template: '<a><i class="icon-trash"></i></a>'
                  }
              },
              action: function(event)
              {
                  var action = event.action, $target = $(event.target), item = event.item;
                  if(action.type === 'edit')
                  {
                      new $.zui.ModalTrigger({
                          type: 'ajax',
                          url: action.linkTemplate.format(item.id),
                          keyboard: true
                      }).show();
                  }
                  else if(action.type === 'delete')
                  {
                      window.open(action.linkTemplate.format(item.id), 'hiddenwin');
                  }
                  else if(action.type === 'sort')
                  {
                      var orders = {};
                      $('#deptTree').find('li:not(.tree-action-item)').each(function()
                      {
                          var $li = $(this);
                          var item = $li.data();
                          orders['orders[' + item.id + ']'] = $li.attr('data-order') || item.order;
                      });
                      $.post('/System/DepartmentUpdate/id/{0}', orders).error(function()
                      {
                          bootbox.alert(lang.timeout);
                      });
                  }
              }
          };
      
          if(false) options.actions["sort"] = false;
          if(false) options.actions["edit"] = false;
          if(false) options.actions["delete"] = false;
      
          var $tree = $('#deptTree').tree(options);
      
          var tree = $tree.data('zui.tree');
          if(!tree.store.time) tree.expand($tree.find('li:not(.tree-action-item)').first());
      
          $tree.on('mouseenter', 'li:not(.tree-action-item)', function(e)
          {
              $('#deptTree').find('li.hover').removeClass('hover');
              $(this).addClass('hover');
              e.stopPropagation();
          });
      });
      </script>
</main>